
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="yes" name="apple-touch-fullscreen" />
<meta name="_csrf_header" th:content="${_csrf.headerName}" />
<meta name="_csrf_parameter" th:content="${_csrf.parameterName}" />
<meta name="_csrf" th:content="${_csrf.token}" />
<title>用户登录</title>
<link rel="stylesheet" th:href="@{/static/customer/css/style.css}" />
<link rel="shortcut icon" type="image/x-icon" th:href="@{/static/favicon.ico}" />
<script th:src="@{/static/customer/js/jquery.min.js}"></script>
<script th:src="@{/static/customer/js/layer/layer.js}"></script>
<script type="text/javascript">
	var url = '';
	if (url == '') {
		window.onload = function() {
			function checkhHtml5() {
				if (typeof (Worker) !== "undefined") {
					return true;
				} else {
					return false;
				}
			}
			if (!checkhHtml5()) {
				window.location.href = '/direct/browser';
			}
		}
	}
</script>
</head>
<body>
	<div class="loginbg-d">
		<div class="loginpd-d">
			<div class="loginbox-d">
				<div class="login-h2">用户登录</div>
				<form th:action="@{/login}" method="post" id="form" onSubmit="return login(this)">
					<div class="login-form">
						<div class="e-username">
							<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
							<div class="form-group field-signform-username required">
								<input type="text" id="signform-username" name="username" th:value="${username}" class="login-input-d" autofocus="autofocus" placeholder="用户名" />
							</div>
						</div>
						<div class="e-password">
							<div class="form-group field-signform-password required">
								<input type="password" id="signform-password" name="password" class="login-input-d" placeholder="密码" autocomplete="new-password" />
							</div>
						</div>
						<!--<div class="password-forget"> <a href="/direct/reset">忘记密码？</a> </div>-->
						<div class="login-dtn-div">
							<button type="submit" class="login-button-d" name="login-button">立即登录</button>
							<a href="signup" class="goRes">去注册</a>
						</div>
					</div>
				</form>
			</div>
			<div class="login-foot">
				<p>Copyright © 2019 BISO</p>
			</div>
		</div>
	</div>
	<input type="hidden" name="error" th:value="${error}" />
	<script th:if="${error}">
		/*<![CDATA[*/
		$(function() {
			layer.alert($("input[name='error']").val(), {
				icon : 2,
				skin : 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
			});
			$(".e-username").addClass("has-error");
			$(".e-password").addClass("has-error");
			$("#signform-username").focus();
		});
		/*]]>*/
	</script>
	<script type="text/javascript">
		/*<![CDATA[*/
		function login(e) {
			var username = $.trim($("#signform-username").val());
			var password = $.trim($("#signform-password").val());
			$(".e-username").removeClass('has-error');
			$(".e-password").removeClass('has-error');
			if (username.length < 4) {
				layer.alert('用户名长度不能小于4位！', {
					icon : 2,
					skin : 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
				}, function(index) {
					$(".e-username").addClass("has-error");
					$("#signform-username").focus();
					layer.close(index);
				});

				return false;
			}
			if (password.length < 4) {
				layer.alert('密码长度不能小于4位！', {
					icon : 2,
					skin : 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
				});
				$(".e-password").addClass("has-error");
				$("#signform-password").focus();
				return false;
			}
			return true;
		}
		$(function() {
			/*
			$("button[name='login-button']").click(function() {
				var username = $("#signform-username").val();
				var password = $("#signform-password").val();

				// 请求后台
				$.post('/login', {
					username : username,
					password : password
				}, function(response) {
					if (!!response.message && !!response.message.message) {
						layer.alert(response.message.message, {
							icon : 2,
							skin : 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
						});
						return;
					}
					console.log(response.message)
				});
			});
			 */
		});
		/*]]>*/
	</script>
</body>
</html>
